@CHARSET "UTF-8";

/* ========================= MAIN LAYOUT DECLARATION ========================= */
/* HEADER */
div#header {
	height : 60px;
	background-color : #1C1F24;
	width : 100%;
	vertical-align: middle;
}

div#application_title {
	position: relative;
	top: 12px;
	left: 38px;
	color: #23A6DE;
	font-size: 20px;
	font-weight: bold;
	display: inline-block;
}

div#application_menu {
	position: absolute;
	font-size: 11px;
	top: 7px;
	right: 47px;
	display: inline-block;
	margin: auto;
}
div#application_menu > * {
	margin-left : 25px;
}

/* CONTENT */
div#content {
	width:100%;
	margin: 0 auto;
	min-height: 500px;
	z-index: 100000;
	overflow: hidden;
}

/* FOOTER */
#footer {
	position:relative;
	height : 76px;
	background-color : #111216;
	width : 100%;
}

#application_lang{
   	position: relative;
	left: 1%;
	bottom: -29%;
	width: 80px;
	height: 27px;
	overflow: hidden;
	background: url(/images/chk_arrow.png) no-repeat right rgba(255, 255, 255, 0);
	background-color: #1C1F24;
	color: #E0E0E0;
	float: left;
}

#application_copyright{
	position: relative;
	height: 36px;
	left: 1%;
	bottom: -35%;
	margin-left: 1%;
	float: left;
	color: #E0E0E0;
	font-size: 11px;
	display: inline-block;
}

#application_social {
	width: 127px;
	position: absolute;
	margin: 0px;
	padding: 0px;
	height: 36px;
	right: 3%;
	top: 34%;
	font-size: 12px;
}
/* =========================================================================== */







/* ========================= LOGIN / ACCOUNT ========================= */
#account_menu{
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	display : none;	
	position:absolute;
    border:1px solid #23A5DF;
    background:#1C1F24;
    padding-left : 10px;
    z-index : 99999;
    top: 60px;
	right: 47px;
	height : 120px;
	font-size: 12px;
	width : 400px;
}
#account_picture{
	margin-top : 10px;
	margin-bottom : 10px;
}
#submenu {
	float:left;
	padding-left:25px;
}
/* =================================================================== */








/* ========================= HOME PAGE ========================= */

#welcome{
	height: 440px;
	background-image: url(/images/cover_home.jpg);
	background-size: cover;
	position:relative;
	margin:0;
	padding:0;
}
#welcome_msg {
	position: absolute;
	top: 48%;
	height: 140px;
	margin-top: -70px;
	margin: 0 auto;
	left: 0;
	width: 100%;
	text-align: center;
	font-size: 15px;
}
#activity {
	background-color : #1C1F24;
	color : #E0E0E0;
	width:100%;
	height:415px;
	margin:0;
	padding:0;
	padding-top : 5%;
	text-align:center;
}
#activity_wrapper, #submission_wrapper{
	display:table;
	width:45%;
	margin:0 auto;
}
div.hr_spacer_left{
	display:table-cell;
    vertical-align:sub;
}
div.hr_spacer_right{
	display:table-cell;
	vertical-align:sub;
}
div.activity_msg, div.submission_msg{
	width: 50%;	
	font-size : 27px;
	height:10%;
	margin:0;
	padding : 0 2%;
	display:table-cell;
}
#activity_details{
	padding-top : 5%;	
}
#activity_ondemand , #activity_relation {
	width : 40%;
	float : left;
	height : 200px;	
}

#activity_relation{
	margin-left : 10%;	
}
#activity_ondemand {
	margin-right: 10%;
}
#activity_relation_label, #activity_ondemand_label {
	color : #7D838F;
	width : 85%;
	margin : auto;
	font-size : 12px;
}
.circle_relation {
	height : 100px;
	width : 100px;
	background: #2C333B;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	border-radius: 50px;	
	margin : auto;
	display : block;
    background-image: url(/images/mic.png);
    background-position:50% 50%;
    background-repeat:no-repeat;   
}

.circle_ondemand {
	height : 100px;
	width : 100px;
	background: #2C333B;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	border-radius: 50px;	
	margin : auto;
	display : block;
    background-image: url(/images/book.png);
    background-position:50% 50%;
    background-repeat:no-repeat;   
}
.circle_clear {
	height : 80px;
	width : 80px;
	background: black;
	-moz-border-radius: 40px;
	-webkit-border-radius: 40px;
	border-radius: 40px;	
	margin : auto;
	display : block;
	position: relative;
	top : -20%;
}
.circle_content{
	position: absolute;
	display: block;
	top: 12%;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	font-size : 30px;
}
#submission{
	height : 475px;
	width : 100%;
	margin:0;
	padding:0;
	background-color : #2C333B;
	color : #E0E0E0;
	text-align:center;
	padding-top : 5%;
}
#submission_message{
	font-size : 12px;
	width : 30%;
	margin: auto;
	padding-top : 30px;
	padding-bottom : 80px;
	color : #7D838F;
}
#submission_offers{
	margin: auto;
	text-align: center;
	display: block;
}
.submission_item{
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	display: inline-block;
	margin-left : 20px;
	margin-right : 20px;
	width : 155px;
	height: 185px;
	background : white;
	cursor : pointer;
	border : 2px solid #2C333B;
}
.submission_desc {
	position: absolute;
	margin-top: -30px;
	width: 150px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 11px;
}
#contact_container{
	height : 140px;
	width : 100%;
	position:relative;
	margin:0;
	padding:0;
}
#contact_message {
	font-size: 21px;
	position: absolute;
	top: 48%;
	height: 140px;
	margin-top: -20px;
	left: 0;
	width: 100%;
	text-align: center;
	color : #949AA6;
}
.white_space_submission {
	background : #D9E0E8;
	height : 65px;
}




/* ============================================================= */



/* ========================= SHARED CLASSES ========================= */

.clean_link , .clean_link:active, .clean_link:focus, .clean_link:visited{
	text-decoration:none;
	border:0;
	cursor:pointer;
}

.clean_link_white , .clean_link_white:active, .clean_link_white:focus, .clean_link_white:visited{
	text-decoration:none;
	border:0;
	cursor:pointer;
	color : #E0E0E0;
}
.clean_link_white:hover { color : #23A6DE; }

.clean_link_blue , .clean_link_blue:active, .clean_link_blue:focus, .clean_link_blue:visited{
	text-decoration:none;
	border:0;
	cursor:pointer;
	color:#23A6DE;
}
.clean_link_blue:hover { color : #E0E0E0; }

.custom_chk {
	background: transparent;
	width: 90px;
	padding: 5px;
	font-size: 13px;
	line-height: 1;
	color: #E0E0E0;
	border: 0;
	border-radius: 0;
	height: 27px;
	-webkit-appearance: none;
}

.custom_btn_blue {
	background-color: #23A5DF;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	text-indent: 0;
	display: inline-block;
	font-size: 15px;
	font-weight: normal;
	font-style: normal;
	height: 50px;
	line-height: 50px;
	width: 150px;
	text-decoration: none;
	text-align: center;
}

.custom_btn {
	background-color: #15181D;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	text-indent: 0;
/*	border: 1px solid grey;*/
	display: inline-block;
	color: #1C2023;
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
	height: 40px;
	line-height: 40px;
	width: 100px;
	text-decoration: none;
	text-align: center;
	text-shadow: 1px 1px 0px #1C1F24;
	cursor:pointer;
}

.custom_btn:active, .custom_btn:focus, .custom_btn:visited{
	color:grey;
}
.custom_btn:hover { color : #23A6DE; }

.custom_btn:active {
	position: relative;
	top: 1px;
}


.size30 { font-size : 30px; }
.size40 { font-size : 40px; }
.customblue { color: #23A6DE; }
.white { color : #E0E0E0; } 
.white:hover { color : #E0E0E0;} .white:visited { color : #E0E0E0;} .white:active { color : #E0E0E0;}
.red { color : red; }
.grey { color : grey; }
.dark_grey { color : #7D848E; }
.green { color : green; }
.bold { font-weight: bold; }
.h_center { text-align:center; }
.v_center { vertical-align: middle; }
.clear { clear:both ; }
.underline { text-decoration: underline; }
.underline:hover { text-decoration: underline; }
.submission_spacer { 
	background : black ; 
	height : 15px; 
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
}
       
       
.bg_customblue { background-color: #23A6DE; }
.bg_dark_grey { background-color : #7D848E; }
.bg_white { background-color : #E0E0E0; } 
.bg_red { background-color : red; }
.bg_grey { background-color : grey; }
.bg_green { background-color : green; }
.bg_black { background-color : black; }

.highlight {
    border: 2px solid rgba(82,168,236,1);
}
* { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box; 
}

/* ================================================================== */


















/* ========================= HTML5, LINKS & STANDARD RULES ========================= */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: Verdana, sans-serif  ; color: #222; }

body { margin: 0; font-size: 1em; line-height: 1.4; z-index: 1; }

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */

::-moz-selection { background: #555; color: #fff; text-shadow: none; }
::selection { background: #555; color: #fff; text-shadow: none; }


a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }

img {
border: 0 none;
}

hr.stylize {
	width:100%;
    border: 0;border: 0; border-top: 1px solid #4B4B4B;
    height: 1px;
    color : #E0E0E0;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(48, 48, 48, 0.75), rgba(0,0,0,0)); 
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(48, 48, 48, 0.75), rgba(0,0,0,0)); 
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(48, 48, 48, 0.75), rgba(0,0,0,0)); 
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(48, 48, 48, 0.75), rgba(0,0,0,0)); 
}
/* Exposant */
.exposant { 
	font-size: 11px; 
	line-height: .8em; 
} 

/* ================================================================================= */